<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>智能菜谱推荐系统 - 登录</title>
    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.0/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
    <link rel="stylesheet" href="/assets/css/common.css">
    <link rel="stylesheet" href="/assets/css/login.css">
</head>
<body>
    <div class="login-container">
        <div class="login-box">
            <div class="login-header">
                <i class="fas fa-utensils"></i>
                <h2>智能菜谱推荐系统</h2>
                <p>让做饭变得简单有趣</p>
            </div>

            <ul class="nav nav-tabs mb-3" role="tablist">
                <li class="nav-item" role="presentation">
                    <button class="nav-link active" data-bs-toggle="tab" data-bs-target="#login-tab">登录</button>
                </li>
                <li class="nav-item" role="presentation">
                    <button class="nav-link" data-bs-toggle="tab" data-bs-target="#register-tab">注册</button>
                </li>
            </ul>

            <div class="tab-content">
                <div class="tab-pane fade show active" id="login-tab">
                    <form id="loginForm">
                        <div class="mb-3">
                            <label class="form-label">用户名</label>
                            <input type="text" class="form-control" name="username" required>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">密码</label>
                            <input type="password" class="form-control" name="password" required>
                        </div>
                        <button type="submit" class="btn btn-primary w-100">登录</button>
                    </form>
                </div>

                <div class="tab-pane fade" id="register-tab">
                    <form id="registerForm">
                        <div class="mb-3">
                            <label class="form-label">用户名</label>
                            <input type="text" class="form-control" name="username" required>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">密码</label>
                            <input type="password" class="form-control" name="password" required>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">昵称</label>
                            <input type="text" class="form-control" name="nickname" required>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">性别</label>
                            <select class="form-select" name="gender">
                                <option value="0">女</option>
                                <option value="1">男</option>
                            </select>
                        </div>
                        <div class="row mb-3">
                            <div class="col-md-4">
                                <label class="form-label">年龄</label>
                                <input type="number" class="form-control" name="age">
                            </div>
                            <div class="col-md-4">
                                <label class="form-label">身高(cm)</label>
                                <input type="number" class="form-control" name="height" step="0.01">
                            </div>
                            <div class="col-md-4">
                                <label class="form-label">体重(kg)</label>
                                <input type="number" class="form-control" name="weight" step="0.01">
                            </div>
                        </div>
                        <button type="submit" class="btn btn-primary w-100">注册</button>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.0/js/bootstrap.bundle.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/layer/3.5.1/layer.min.js"></script>
    <script src="/assets/js/config.js"></script>
    <script src="/assets/js/request.js"></script>
    <script src="/assets/js/login.js"></script>
</body>
</html>

